// @import url(./zufang.css);

@rootSize: 37.5rem;

.ZT{
  width: 100%;
  background:-webkit-linear-gradient(
    top,#ececec,#ffffff
  );
 
  .ZTL{
    width: 100%;
    height: (50/  @rootSize);
    display: flex;
    img{
      width: 100%;
      height: (50 /@rootSize);
   }
  }
  // 顶部搜索栏
  .DB{
    width: 100%;
    height: (92/@rootSize);
    // background-color: lawngreen;
    display: flex;
    align-items: center;
    justify-content: space-between;
// 地区
    .DQ{
      width: (100 / @rootSize);
      height: (50/@rootSize);
      // background-color: rebeccapurple;
      font-size: 16px;
      
    }
// 中间搜索框
    .SSuo{
      height: (74/ @rootSize);
      width: (500 / @rootSize);
      background-color: #f7f7f7;
      display: flex;
      align-items: center;
      position: relative;
      border-radius: (37/ @rootSize);
      
      i{
        height: (50 / @rootSize);
        width: (50 / @rootSize);
        // background-color: antiquewhite;
        position: absolute;
        left: .5rem;
        display: flex;
        align-items: center;
        
      }
      span{
        height: (50 / @rootSize);
        width: (360 / @rootSize);
        // background-color: red;
        position: absolute;
        left: 2rem;
        color: #919191;
      }
    }
    // 右侧消息图标
    .XXI{
      height: (50 / @rootSize);
      width: ( 50 / @rootSize);
      // background-color: blue;
      display: flex;
      img{
        height: (50 / @rootSize);
        width: ( 50 / @rootSize);
     }
    }
  }
  

// 在线签约
  .ZXQY{
    width: 100%;
    height: (310 / @rootSize);
    // background-color: pink;
    img{
      width: 100%;
      height: 100%;
    }
    div{
      height: .5rem;
      width: 3rem;
      // background-color: lawngreen;
      display: flex;
      align-items: center;
      justify-content: space-evenly;
      position: relative;
      left: 40%;
      
      div{
        width: .5rem;
      height: .25rem;
      background-color:#1e1e1e;
      border-radius: 40%;

      }
      
    }
  }

  // 整租合租
  .ZZHZ{
    width: 100%;
    height: (200 / @rootSize);
    display: flex;
    justify-content: space-between;
    position: relative;
    top: 1rem;
    .ZZ{
      width: 48%;
      // background-color: pink;
      img{
        height: (200 / @rootSize);
        width: 100%;
      }
    }
 
  }

  // 超值优惠
  .CZYH{
    height: (108/@rootSize);
    width: 100%;
    // background-color: pink;
    display: flex;
    justify-content: space-between ;
    align-items: flex-end;

    h4{
      height: (40/@rootSize);
      font-size: 18px;
      position: relative;
      top: 1.2rem;
    }
    img{
      height: (40/@rootSize);
      width: (36 / @rootSize);
    }

  }

  // 优惠房
  .YHF{
    width: 100%;
    height: (400 / @rootSize);
    display: flex;
    justify-content: space-between;
    position: relative;
    top: 2rem;
    // background-color: pink;
    div{
      width: (400 / @rootSize);
      height: (700/ @rootSize);
      // background-color: lawngreen;
      
      img{
        width: 100%;
        // height: (116/ @rootSize);
      }
      p:nth-of-type(1){
        position: relative;
        top: -1rem;
        height: (26 /@rootSize);
        color: #000000;
        font-size: 13px;
      }
      p:nth-of-type(2){
        position: relative;
        top: -1rem;
        height: (22 /@rootSize);
        color: #1e1e1e;
        font-size: 11px;
      }
      span{
        position: relative;
        top: -1rem;
        left: -0.2rem;
        height: (22 /@rootSize);
        font-size: 11px;
        color:#f39800 ;
      }
    }
  }

  // 广告招募
  .GGZM{
    width: 100%;
    height: (160 /@rootSize);
    // background-color: pink;
    position: relative;;
    top: 4rem;
    img{
      width: 100%;
      height: 100%;
    }
  }

  .WNTJ{
    height: (108/@rootSize);
    width: 100%;
    // background-color: pink;
    position: relative;
    top: 4rem;
    display: flex;
    align-items: center ;
  }
  h4{
    font-size: 23px;
  }
  span:nth-of-type(2){
    position: relative;
    left: 12rem;
    top:.5rem;
    color: #a8a8a8;
  }
  span:nth-of-type(1){
    position: relative;
    left: 10rem;
    top:.5rem;
  }
// 房源信息
  .FANGYUAN{

    .FYXX{
      height: (290 /@rootSize);
      width: 100%;
      // background-color: pink;
      position: relative;
      top: 5rem;
      img{
        height: (200 /@rootSize);
        width: (260 / @rootSize);
      }
      div{
        position: relative;
        top: -7rem;
        left:7.5rem;
        h5{
          font-size: 16px;
        }
        p{
          font-size: 11px;
          position: relative;
          top: -1rem;
        }
        p:nth-of-type(3){
          color: #f39800;
          font-size: 15px;
        }

      }

    }
  }

  // 更多优惠房源
  .GDYHFY{
    height: (100 /@rootSize);
    // background-color: pink;
    position: relative;
    top: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    

    div{
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      width: (520 /@rootSize);
      background-color: #f2f2f3;
      border-radius: (50/ @rootSize);
      color: #bdbdbd;
    }
  }

  // 品牌故事入口
  .PPGSRK{
    width: 100%;
    height: (170 / @rootSize);
    // background-color: pink;
    position: relative;
    top: 6rem;
    img{
      width: 100%;
      height: 100%;
    }
  }

  .DB{
    height: (100/@rootSize);
    // background-color: pink;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    position: relative;
    top: 7rem;
    div{
      img{
        width: (40 / @rootSize);
        height: (40 / @rootSize);
        position: relative;
        top: .75rem;
        left: .25rem;
      }
      p{
        font-size: 11px;
      }
      
    }
    div:nth-of-type(2){
      img{
        position: relative;
        top: .75rem;
        left: .85rem;
      }
    }
    div:nth-of-type(3){
      img{
        position: relative;
        top: .75rem;
        left: .85rem;
      }
    }
  }


}



